import { Overlay } from '@nutui/nutui-react-taro'
import classNames from 'classnames'
import styles from './index.module.less'

interface IProps {
  visible: boolean,
  children: React.ReactNode,
  className?: string,
  maskClick?:()=>void
}

const Modal = (props:IProps) => {
  const { visible, children, className = '', maskClick } = props
  return (
    <Overlay visible={visible} lockScroll>
      <div className={styles.modalWrap} onClick={maskClick}>
        <div
          className={classNames(styles.content, className)} 
          onClick={(e) => {
            e?.preventDefault()
            e?.stopPropagation() 
          }}
        >
          {children}
        </div>
      </div>
    </Overlay>
  )
}

export default Modal